import { defineStore } from "pinia";
import { store } from "@/store";
import projectSetting from "@/settings/projectSetting";
import type {
  ImenuSetting,
  IheaderSetting,
  IcrumbSetting,
  ImultiTabsSetting,
} from "/#/config";

const {
  permissionMode,
  navMode,
  navTheme,
  menuSetting,
  headerSetting,
  crumbSetting,
  multiTabsSetting,
  isPageAnimate,
  pageAnimateType,
} = projectSetting;

interface ProjectSettingState {
  permissionMode: string; //权限模式
  navMode: string; //导航模式 顶部菜单 左侧菜单
  navTheme: string; // 导航风格
  menuSetting: ImenuSetting; //菜单
  headerSetting: IheaderSetting; //顶部设置
  crumbSetting: IcrumbSetting; //面包屑
  multiTabsSetting: ImultiTabsSetting; //多标签
  isPageAnimate: boolean; // 是否开启路由动画
  pageAnimateType: string; // 路由动画类型
}

export const useProjectSettingStore = defineStore({
  id: "app-project-setting",
  state: (): ProjectSettingState => ({
    permissionMode,
    navMode: navMode,
    navTheme: navTheme,
    menuSetting: menuSetting,
    headerSetting: headerSetting,
    crumbSetting: crumbSetting,
    multiTabsSetting: multiTabsSetting,
    isPageAnimate: isPageAnimate,
    pageAnimateType: pageAnimateType,
  }),
  getters: {
    getPermissionMode(): string {
      return this.permissionMode;
    },
    // 获取导航模式
    getNavMode(): string {
      return this.navMode;
    },
    // 获取主题
    getNavTheme(): string {
      return this.navTheme;
    },
    // 获取菜单
    getMenuSetting(): object {
      return this.menuSetting;
    },
    // 获得顶部设置
    getHeaderSetting(): object {
      return this.headerSetting;
    },
    // 获取面包屑
    getCrumbSetting(): object {
      return this.crumbSetting;
    },
    // 获取多标签
    getMultiTabsSetting(): object {
      return this.multiTabsSetting;
    },
    // 是否开启路由动画
    getIsPageAnimate(): boolean {
      return this.isPageAnimate;
    },
    // 路由动画类型
    getPageAnimateType(): string {
      return this.pageAnimateType;
    },
  },
  actions: {
    setPermissionMode(value: string): void {
      this.permissionMode = value;
    },
    setNavMode(value: string): void {
      this.navMode = value;
    },
    setNavTheme(value: string): void {
      this.navTheme = value;
    },
    setMenuSetting(value: ImenuSetting): void {
      this.menuSetting = value;
    },
    setHeaderSetting(value: IheaderSetting): void {
      this.headerSetting = value;
    },
    setCrumbSetting(value: IcrumbSetting): void {
      this.crumbSetting = value;
    },
  },
});

/**
 * @description: Need to be used outside the setup
 */
export function useProjectSettingStoreWithOut() {
  return useProjectSettingStore(store);
}
